import React from 'react';
import { connect } from 'dva';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import { Card, Spin, message, Button, Table } from 'antd';
import moment from 'moment';
import router from 'umi/router';
import queryString from 'query-string';
import PageHeaderWrapper from '@/components/PageHeaderWrapper';
import DescriptionList from '@/components/DescriptionList';
import FooterToolbar from '@/components/FooterToolbar';
import QuoDetailModal from '../../components/QuoDetailModal';
import InsAccoModal from '../../components/InsAccoModal';
import AccuAccoModal from '../../components/AccuAccoModal';
import InjSecAccoDetailModal from '../../components/InjSecAccoDetailModal';
import Policy from '../../components/PolicyDetail';
import AddEmploeTask from './AddEmploeTask';
import ReduceEmploeTask from './ReduceEmploeTask';
import AdjustTask from './AdjustTask';
import SocialHandleInfor from './SocialHandleInfor';
import RefundInfor from './RefundInfor';
import TextOverFlow from '../../components/TextOverFlow';
import Payroll from './Payroll';

const { Description } = DescriptionList;
@connect(({ empsearch, loading }) => ({
  loading: loading.models.empsearch,
  addTaskList: empsearch.addTaskList, // 增员任务列表数据
  reduceTaskList: empsearch.reduceTaskList, // 减员任务列表数据
  adjustTaskList: empsearch.adjustTaskList, // 调整任务列表数据
  empInsSerInfoList: empsearch.empInsSerInfoList, // 社保服务办理列表数据
  empInsRefundInfoList: empsearch.empInsRefundInfoList, // 返款信息列表数据
  wageDataList: empsearch.wageDataList, // 代发工资列表数据
  detailInfoLoding: loading.effects['batchquo/fetchQuoInfo'],
}))
@Form.create()
class Details extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      sendId: null,
      idCode: null, // 员工身份证
      empName: null, // 员工姓名
      detailInfo: {
        laborContDetDto: {},
      },
      scroll: { x: 2300 },
      accuOrIns: null,
      pdId: null,
      plcyId: null,
      policyVisible: false,
    };
  }

  componentDidMount() {
    const { location, dispatch } = this.props;
    const { sendId } = queryString.parse(location.search);
    // 获取页面所有的字典值
    dispatch({
      type: 'publicdata/fetchDictCode',
      payload: ['BIZ_TYPE'],
    }).then(data => {
      this.getDatail(sendId, data);
    });
  }

  // 获取详情
  getDatail = sendId => {
    const { dispatch } = this.props;
    dispatch({
      type: 'empsearch/getEmpDetail',
      payload: {
        sendId,
      },
    }).then(response => {
      if (response.success && response.data) {
        this.setState(
          {
            sendId,
            detailInfo: response.data,
            idCode: response.data.idCode,
            empName: response.data.empName,
          },
          () => {
            // 获取增员任务列表数据
            this.getAddTaskList(response.data.empId);
            // 获取减员任务列表数据
            this.getReduceTaskList(response.data.empId);
            // 获取调整任务列表数据
            this.getAdjustList(response.data.empId);
            // 获取社保服务办理列表数据
            this.getEmpInsSerInfo(response.data.idCode);
            // 获取返款信息列表数据
            this.getEmpInsRefundInfo(response.data.idCode);
            // 获取代发工资列表数据
            this.getWageInfo(response.data.empId);
          }
        );
      } else {
        message.warning(`${response.message || '暂无数据！'}`);
      }
    });
  };

  // 获取增员任务列表数据
  getAddTaskList = empId => {
    const { dispatch } = this.props;
    const { sendId } = this.state;
    dispatch({
      type: 'empsearch/getAddTaskList',
      payload: {
        empId,
        allSource: 1,
        sendId,
      },
    });
  };

  // 获取减员任务列表数据
  getReduceTaskList = empId => {
    const { dispatch } = this.props;
    const { sendId } = this.state;
    dispatch({
      type: 'empsearch/getReduceTaskList',
      payload: {
        empId,
        allSource: 1,
        sendId,
      },
    });
  };

  // 获取调整任务列表数据
  getAdjustList = empId => {
    const { dispatch } = this.props;
    const { sendId } = this.state;
    dispatch({
      type: 'empsearch/getAdjustTaskList',
      payload: {
        empId,
        sendId,
      },
    });
  };

  // 获取社保服务办理数据
  getEmpInsSerInfo = certNo => {
    const { dispatch } = this.props;
    dispatch({
      type: 'empsearch/getEmpInsSerInfoData',
      payload: {
        certNo,
      },
    });
  };

  // 获取返款信息列表数据
  getEmpInsRefundInfo = certNo => {
    const { dispatch } = this.props;
    dispatch({
      type: 'empsearch/getEmpInsRefundInfoData',
      payload: {
        certNo,
      },
    });
  };

  // 获取代发工资列表数据
  getWageInfo = empId => {
    const { dispatch } = this.props;
    dispatch({
      type: 'empsearch/getWageInfoData',
      payload: {
        empId,
      },
    });
  };

  // 跳转
  jumpRouting = (targetRouter, id, taskSource) => {
    let dynamicRouter;
    switch (targetRouter) {
      case 'addTaskId':
        dynamicRouter = '/customservicemanage/addemployee'; // 增员任务
        break;
      case 'deduTaskId':
        dynamicRouter = '/customservicemanage/reduceemployee'; // 减员任务
        break;
      case 'adjTaskId':
        dynamicRouter = '/customservicemanage/adjusttask'; // 调整任务
        break;
      case 'insSerHdlId':
        dynamicRouter = '/socaccmanage/sochandle'; // 社保服务办理
        break;
      case 'refundInfoId':
        dynamicRouter = '/socaccmanage/rebate'; // 返款信息
        break;
      case 'wageOrderInfoId':
        dynamicRouter = '/salarymanage/protection'; // 代发工资
        break;
      case 'wageOrderProbId':
        dynamicRouter = '/salarymanage/protection'; // 代发工资问题人员
        break;
      default:
    }
    const { empName, idCode, sendId } = this.state;
    let pathname = null;
    if (id) {
      if (targetRouter === 'wageOrderInfoId') {
        pathname = `${dynamicRouter}/maintaindetail`; // 代发工资的详情
      } else if (targetRouter === 'adjTaskId') {
        // 调整任务的详情
        if (taskSource === 3) { // 人员及收费
          pathname = `${dynamicRouter}/persondetail`;
        } else {
          pathname = `${dynamicRouter}/detail`;
        }
      } else {
        pathname = `${dynamicRouter}/detail`;
      }
    } else {
      // 跳转首页
      pathname = `${dynamicRouter}/index`;
    }
    // 判断有没有任务来源，有没有调整类型
    if (targetRouter === 'addTaskId' || targetRouter === 'deduTaskId') {
      // 增员减员
      if (taskSource) {
        const routerParams = {
          pathname,
          query: {
            [targetRouter]: id,
            isMenuLink: false,
            taskSource,
            sendId,
          },
          queryParam: { empName, idCode },
        };
        router.push(routerParams);
      } else {
        const routerParams = {
          pathname,
          query: {
            [targetRouter]: id,
            isMenuLink: false,
          },
          queryParam: { empName, idCode },
        };
        router.push(routerParams);
      }
    } else if (targetRouter === 'adjTaskId') {
      // 调整任务
      if (taskSource) {
        const routerParams = {
          pathname,
          query: {
            [targetRouter]: id,
            isMenuLink: false,
            adjType: taskSource,
          },
          queryParam: { empName, idCode },
        };
        router.push(routerParams);
      } else {
        const routerParams = {
          pathname,
          query: {
            [targetRouter]: id,
            isMenuLink: false,
          },
          queryParam: { empName, idCode },
        };
        router.push(routerParams);
      }
    } else if (targetRouter === 'refundInfoId') {
      // 返款信息
      if (taskSource) {
        const routerParams = {
          pathname,
          query: {
            [targetRouter]: id,
            isMenuLink: false,
            type: taskSource,
          },
          queryParam: { empName, idCode },
        };
        router.push(routerParams);
      } else {
        const routerParams = {
          pathname,
          query: {
            [targetRouter]: id,
            isMenuLink: false,
          },
          queryParam: { empName, idCode },
        };
        router.push(routerParams);
      }
    } else {
      const routerParams = {
        pathname,
        query: {
          [targetRouter]: id,
          isMenuLink: false,
        },
        queryParam: { empName, idCode },
      };
      router.push(routerParams);
    }
  };

  // 获取报价单信息
  getQuoDetail = quoId => {
    this.quoDetail.getQuoDetail(quoId);
  };

  // 获取政策组合信息
  getPolicyDetail = record => {
    this.cancelPolicyModal(true);
    this.setState({
      accuOrIns: record.ass && record.ass === 2 ? 2 : 1,
      pdId: record.ass && record.ass.toString(),
      plcyId: record.grpId,
    });
  };

  // 控制政策组件的显示隐藏
  cancelPolicyModal = modalClose => {
    this.setState({ policyVisible: modalClose });
  };

  // 获取社保，公积金，工伤二级户的详情
  getAccoDetail = record => {
    if (record.ass && record.ass === 5) {
      // 区分是工伤二级户还是社保大库 （injFlag）
      if (record.injFlag && record.injFlag === 1) {
        // 石家庄工伤二级户
        // 工伤二级户
        this.injSecAccoDetail.getinjSecAccoDetail(1, 10, record.accoId);
      } else {
        // 社保
        this.insDetail.getInsDetail(record.accoId, record.payWay);
      }
    } else if (record.ass && record.ass === 2) {
      // 公积金
      this.accuDetail.getAccuDetail(record.accoId, record.payWay);
    } else {
      // 社保
      this.insDetail.getInsDetail(record.accoId, record.payWay);
    }
  };

  render() {
    const { detailInfo, scroll, accuOrIns, pdId, plcyId, policyVisible } = this.state;
    const { loading } = this.props;
    // 收费信息中的产品
    const pdCloumns = [
      {
        title: '产品',
        dataIndex: 'pdName',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: val => val || '--',
      },
      {
        title: '业务开始日期',
        dataIndex: 'startDate',
        sorter: (a, b) => new Date(b.startDate) - new Date(a.startDate),
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: val => (val ? moment(val).format('YYYY-MM-01') : '--'),
      },
      {
        title: '业务结束日期',
        dataIndex: 'endDate',
        sorter: (a, b) => new Date(b.endDate) - new Date(a.endDate),
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: val => (val ? moment(val).format('YYYY-MM-DD') : '--'),
      },
      {
        title: '服务费',
        dataIndex: 'serAmo',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        align: 'right',
        render: val => (val === 0 ? 0 : (val && val) || '--'),
      },
      {
        title: '执行地',
        dataIndex: 'cityName',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        align: 'center',
        render: val => val || '--',
      },
      {
        title: '执行方',
        dataIndex: 'execTypeName',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        align: 'center',
        render: val => val || '--',
      },
      {
        title: '接单方',
        dataIndex: 'recvSuppName',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: val => <TextOverFlow text={val} />,
      },
    ];
    // 社保公积金信息
    const insAccuCloumns = [
      {
        title: '险种',
        dataIndex: 'assName',
        onCell: () => ({ style: { width: '150px' } }),
        onHeaderCell: () => ({ style: { fontWeight: 'bold', width: '150px' } }),
        fixed: 'left',
        render: val => val || '--',
      },
      {
        title: '业务开始日期',
        dataIndex: 'beginYm',
        sorter: (a, b) => new Date(b.beginYm) - new Date(a.beginYm),
        onCell: () => ({ style: { width: '150px' } }),
        onHeaderCell: () => ({ style: { fontWeight: 'bold', width: '150px' } }),
        fixed: 'left',
        render: val => (val ? moment(val).format('YYYY-MM-01') : '--'),
      },
      {
        title: '业务结束日期',
        dataIndex: 'endYm',
        sorter: (a, b) => new Date(b.endYm) - new Date(a.endYm),
        onCell: () => ({ style: { width: '150px' } }),
        onHeaderCell: () => ({ style: { fontWeight: 'bold', width: '150px' } }),
        fixed: 'left',
        render: val => (val ? moment(val).format('YYYY-MM-DD') : '--'),
      },
      {
        title: '缴纳金额',
        dataIndex: 'payAmount',
        onCell: () => ({ style: { width: '150px' } }),
        onHeaderCell: () => ({ style: { fontWeight: 'bold', width: '150px' } }),
        align: 'right',
        render: val => (val === 0 ? 0 : (val && val) || '--'),
      },
      {
        title: '申报工资',
        dataIndex: 'decWage',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        align: 'right',
        render: val => (val === 0 ? 0 : (val && val) || '--'),
      },
      {
        title: '企业基数',
        dataIndex: 'entpBase',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        align: 'right',
        render: val => (val === 0 ? 0 : (val && val) || '--'),
      },
      {
        title: '企业比例(%)',
        dataIndex: 'entpProp',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        align: 'right',
        render: val => (val === 0 ? 0 : (val && val) || '--'),
      },
      {
        title: '企业固定金额',
        dataIndex: 'entpAddnAmo',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        align: 'right',
        render: val => (val === 0 ? 0 : (val && val) || '--'),
      },
      {
        title: '企业缴费',
        dataIndex: 'entpPay',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        align: 'right',
        render: val => (val === 0 ? 0 : (val && val) || '--'),
      },
      {
        title: '个人基数',
        dataIndex: 'perBase',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        align: 'right',
        render: val => (val === 0 ? 0 : (val && val) || '--'),
      },
      {
        title: '个人比例(%)',
        dataIndex: 'perProp',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        align: 'right',
        render: val => (val === 0 ? 0 : (val && val) || '--'),
      },
      {
        title: '个人固定金额',
        dataIndex: 'perAddnAmo',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        align: 'right',
        render: val => (val === 0 ? 0 : (val && val) || '--'),
      },
      {
        title: '个人缴费',
        dataIndex: 'perPay',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        align: 'right',
        render: val => (val === 0 ? 0 : (val && val) || '--'),
      },
      {
        title: '缴费方式',
        dataIndex: 'payWayName',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: val => val || '--',
      },
      {
        title: '政策组合',
        dataIndex: 'grpName',
        width: 200,
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: (text, record) => (
          <a onClick={() => this.getPolicyDetail(record)}>{text || '--'}</a>
        ),
      },
      {
        title: '缴纳账户',
        dataIndex: 'accoName',
        width: 200,
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: (text, record) => <a onClick={() => this.getAccoDetail(record)}>{text || '--'}</a>,
      },
      {
        title: '个人账号',
        dataIndex: 'assIndvAccoNo',
        onCell: () => ({ style: { width: '150px' } }),
        onHeaderCell: () => ({ style: { fontWeight: 'bold', width: '150px' } }),
        render: val => val || '--',
      },
      {
        title: '缴费人员类别',
        dataIndex: 'insIdeName',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: val => val || '--',
      },
      {
        title: '执行地',
        dataIndex: 'cityName',
        onCell: () => ({ style: { width: '120px' } }),
        onHeaderCell: () => ({ style: { fontWeight: 'bold', width: '120px' } }),
        render: val => val || '--',
      },
      {
        title: '接单方',
        dataIndex: 'recvSuppName',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: val => <TextOverFlow text={val} />,
      },
    ];

    return (
      <PageHeaderWrapper>
        <Spin tip="Loading..." spinning={loading}>
          <Card title={<span style={{ fontWeight: 'bolder' }}>派单信息</span>}>
            <DescriptionList>
              <Description term="签约方">{detailInfo.sendCorpName || '--'}</Description>
              <Description term="客户名称">{detailInfo.custName || '--'}</Description>
              <Description term="商务合同">{detailInfo.custContName || '--'}</Description>
              <Description term="报价单">
                <a onClick={() => this.getQuoDetail(detailInfo.quoId)}>
                  {detailInfo.quoName || '--'}
                </a>
              </Description>
              <Description term="派单状态">{detailInfo.sendStatusName || '--'}</Description>
              <Description term="锁定状态">{detailInfo.lockStatusName || '--'}</Description>
              <Description term="派单时间">
                {(detailInfo.sendDate && moment(detailInfo.sendDate).format('YYYY-MM-DD HH:mm')) ||
                  '--'}
              </Description>
              <Description term="业务部">{detailInfo.operDepName || '--'}</Description>
              <Description term="业务员">{detailInfo.operName || '--'}</Description>
              <Description term="所属客服">{detailInfo.primName || '--'}</Description>
              <Description term="创建人">{detailInfo.creName || '--'}</Description>
            </DescriptionList>
          </Card>
          <Card title={<span style={{ fontWeight: 'bolder' }}>员工信息</span>}>
            <DescriptionList>
              <Description term="姓名">{detailInfo.empName || '--'}</Description>
              <Description term="证件类型">{detailInfo.idTypeName || '--'}</Description>
              <Description term="证件号">{detailInfo.idCode || '--'}</Description>
              <Description term="国籍">{detailInfo.nationName || '--'}</Description>
              <Description term="出生日期">
                {(detailInfo.birthDateStr &&
                  moment(detailInfo.birthDateStr).format('YYYY-MM-DD')) ||
                  '--'}
              </Description>
              <Description term="性别">{detailInfo.genderName || '--'}</Description>
              <Description term="电话">{detailInfo.mobile || '--'}</Description>
              <Description term="员工邮箱">{detailInfo.email || '--'}</Description>
            </DescriptionList>
          </Card>
          {(detailInfo.sendStatus && detailInfo.sendStatus === 4) || detailInfo.sendStatus === 5 ? (
            <Card title={<span style={{ fontWeight: 'bolder' }}>离职信息</span>}>
              <DescriptionList>
                <Description term="离职日期">
                  {detailInfo.evaDateStr
                    ? moment(detailInfo.evaDateStr).format('YYYY-MM-DD')
                    : '--'}
                </Description>
                <Description term="业务结束日期">
                  {detailInfo.busiEndYm ? moment(detailInfo.busiEndYm).format('YYYY-MM-DD') : '--'}
                </Description>
                <Description term="离职原因">{detailInfo.evaReasonName || '--'}</Description>
                <Description term="是否离职联系">{detailInfo.unempFlagName || '--'}</Description>
                <Description term="操作人">{detailInfo.operName || '--'}</Description>
                <Description term="操作时间">
                  {(detailInfo.operTime &&
                    moment(detailInfo.operTime).format('YYYY-MM-DD HH:mm')) ||
                    '--'}
                </Description>
              </DescriptionList>
            </Card>
          ) : null}
          <Card title={<span style={{ fontWeight: 'bolder' }}>收费信息</span>}>
            <DescriptionList>
              <Description term="入职日期">
                {detailInfo.entryDate ? moment(detailInfo.entryDate).format('YYYY-MM-DD') : '--'}
              </Description>
              <Description term="业务开始日期">
                {detailInfo.sendBeginDate
                  ? moment(detailInfo.sendBeginDate).format('YYYY-MM-DD')
                  : '--'}
              </Description>
              <Description term="是否员工联系">{detailInfo.addConEmpFlagName || '--'}</Description>
              <Description term="所属成本中心">{detailInfo.costCenterName || '--'}</Description>
              <Table
                dataSource={detailInfo.responseSerOrdProdDetDtos || []}
                columns={pdCloumns}
                rowKey={record => record.pdId}
                loading={loading}
                pagination={false}
                style={{ margin: '12px 12px', width: '100%' }}
              />
            </DescriptionList>
          </Card>
          <Card title={<span style={{ fontWeight: 'bolder' }}>社保公积金信息</span>}>
            <Table
              dataSource={detailInfo.responseSerSetPageDtos || []}
              columns={insAccuCloumns}
              rowKey={(_, index) => index}
              loading={loading}
              scroll={scroll}
              pagination={false}
            />
          </Card>
          {/* 增员任务 */}
          <AddEmploeTask jumpRouting={this.jumpRouting} />
          {/* 减员任务 */}
          <ReduceEmploeTask jumpRouting={this.jumpRouting} />
          {/* 调整任务 */}
          <AdjustTask jumpRouting={this.jumpRouting} />
          {/* 社保服务办理 */}
          <SocialHandleInfor jumpRouting={this.jumpRouting} />
          {/* 返款信息 */}
          <RefundInfor jumpRouting={this.jumpRouting} />
          {/* 代发工资 */}
          <Payroll jumpRouting={this.jumpRouting} />
          {/* 劳动合同信息 */}
          <Card title={<span style={{ fontWeight: 'bolder' }}>劳动合同信息</span>}>
            <DescriptionList style={{ marginBottom: 24 }}>
              <Description term="合同编号">
                {(detailInfo.laborContDetDto && detailInfo.laborContDetDto.contNo) || '--'}
              </Description>
              <Description term="合同签署方式">
                {(detailInfo.laborContDetDto && detailInfo.laborContDetDto.contSignWay) || '--'}
              </Description>
              <Description term="合同类型">
                {(detailInfo.laborContDetDto && detailInfo.laborContDetDto.contType) || '--'}
              </Description>
              <Description term="有无固定期限">
                {(detailInfo.laborContDetDto && detailInfo.laborContDetDto.fixedDeadlnFlag) || '--'}
              </Description>
              <Description term="合同开始日期">
                {detailInfo.laborContDetDto && detailInfo.laborContDetDto.contBeginDate
                  ? moment(detailInfo.laborContDetDto.contBeginDate).format('YYYY-MM-DD')
                  : '--'}
              </Description>
              <Description term="合同结束日期">
                {detailInfo.laborContDetDto && detailInfo.laborContDetDto.contEndDate
                  ? moment(detailInfo.laborContDetDto.contEndDate).format('YYYY-MM-DD')
                  : '--'}
              </Description>
              <Description term="有无试用期">
                {(detailInfo.laborContDetDto && detailInfo.laborContDetDto.probtnFlag) || '--'}
              </Description>
              {detailInfo.laborContDetDto && detailInfo.laborContDetDto.probtnFlag === '有' ? (
                <Description term="试用期开始日期">
                  {detailInfo.laborContDetDto && detailInfo.laborContDetDto.probtnBeginDate
                    ? moment(detailInfo.laborContDetDto.probtnBeginDate).format('YYYY-MM-DD')
                    : '--'}
                </Description>
              ) : (
                <div />
              )}
              {detailInfo.laborContDetDto && detailInfo.laborContDetDto.probtnFlag === '有' ? (
                <Description term="试用期结束日期">
                  {detailInfo.laborContDetDto && detailInfo.laborContDetDto.probtnEndDate
                    ? moment(detailInfo.laborContDetDto.probtnEndDate).format('YYYY-MM-DD')
                    : '--'}
                </Description>
              ) : (
                <div />
              )}
              <Description term="合同期劳动报酬">
                {(detailInfo.laborContDetDto && detailInfo.laborContDetDto.contWage) || '--'}
              </Description>
              <Description term="试用期劳动报酬">
                {(detailInfo.laborContDetDto && detailInfo.laborContDetDto.probtnWage) || '--'}
              </Description>
              <Description term="工时">
                {(detailInfo.laborContDetDto && detailInfo.laborContDetDto.laborHour) || '--'}
              </Description>
              <Description term="岗位">
                {(detailInfo.laborContDetDto && detailInfo.laborContDetDto.wkJob) || '--'}
              </Description>
              <Description term="工作地点">
                {(detailInfo.laborContDetDto && detailInfo.laborContDetDto.wkLoc) || '--'}
              </Description>
              <Description term="工作内容">
                {(detailInfo.laborContDetDto && detailInfo.laborContDetDto.wkContent) || '--'}
              </Description>
              <Description term="是否做入职体检">
                {(detailInfo.laborContDetDto && detailInfo.laborContDetDto.entryMedExamFlag) ||
                  '--'}
              </Description>
              <Description term="状态">
                {(detailInfo.laborContDetDto && detailInfo.laborContDetDto.status) || '--'}
              </Description>
            </DescriptionList>
          </Card>
          <FooterToolbar style={{ width: '100%' }}>
            <Button onClick={() => window.history.back()}>返回</Button>
          </FooterToolbar>
        </Spin>
        {/* 报价单详情弹框 */}
        <QuoDetailModal
          onRef={ref => {
            this.quoDetail = ref;
          }}
        />
        {/* 社保账户详情弹框 */}
        <InsAccoModal
          onRef={ref => {
            this.insDetail = ref;
          }}
        />
        {/* 公积金账户详情弹框 */}
        <AccuAccoModal
          onRef={ref => {
            this.accuDetail = ref;
          }}
        />
        {/* 工伤二级户详情弹框 */}
        <InjSecAccoDetailModal
          onRef={ref => {
            this.injSecAccoDetail = ref;
          }}
        />
        {/* 政策组合详情弹框 */}
        {policyVisible ? (
          <Policy
            plcyId={plcyId}
            accuOrIns={accuOrIns}
            areaId={detailInfo.cityId} // 城市
            pdId={pdId} // 产品和险种的id
            cancelPolicyModal={modalClose => this.cancelPolicyModal(modalClose)}
          />
        ) : null}
      </PageHeaderWrapper>
    );
  }
}
export default Details;
